<template>
	<div class="card" id="bill-detail-train">
    <div class="card-header">火车票明细</div>          
    <table class="table table-response table-striped table-hover table-sm">
        <thead>
            <tr class="bg-info">
                <th>班次</th>
                <th>日期</th>
                <th>出发</th>
                <th>到达</th>
                <th>等级</th>
            </tr>
        </thead>
        <tbody>
            <template  v-for="info in detailInfo.trainTickets">
              <tr :key="info.id">   
                <td>{{info.trainNo}}</td>
                <td>{{info.ddate}}</td>
                <td>{{info.dcity}}</td>
                <td>{{info.acity}}</td>
                <td>{{info.seatClass}}</td>
              </tr>
            </template>

        </tbody>
    </table>	
    <table class="table table-response table-striped table-hover table-sm">
        <thead>
            <tr class="bg-info">
                <th>乘客</th>
                <th>人数</th>
                
                <th>备注</th>
            </tr>
        </thead>
        <tbody>
            <template  v-for="info in detailInfo.trainTickets">
              <tr :key="info.id">   
                <td>
                    {{info.passengerName}}
                </td>
                <td>{{info.psgCount}}</td>
               
                <td>{{info.remark}}</td>
              </tr>
            </template>

        </tbody>
    </table>	
    <table class="table table-response table-striped table-hover table-sm">
        <thead>
            <tr class="bg-info">
                <th>价格</th>
                <th>成本</th>
                <th>服务费</th>
            </tr>
        </thead>
        <tbody>
            <template  v-for="info in detailInfo.trainTickets">
              <tr :key="info.id">   
                <td>{{info.price}}</td>
                <td>{{info.cost}}</td>
                <td>{{info.serviceCharge}}</td>
              </tr>
            </template>

        </tbody>
    </table>	
  </div>

</template>

<script>
  export default {
    props: {
      detailInfo: {
        type: Object
      }
    }
  }		
</script>